<template>
    <div id="BlogMain">
        <!--<ul>
            <li v-for="blogMain in blogMains">
                <a>{{blogMain.title}}-{{blogMain.keyPoint}}</a>
            </li>
        </ul>-->
        <el-table :data="blogMains" style="width: 50%">
            <el-table-column prop="title" label="标题">

            </el-table-column>
            <el-table-column prop="keyPoint" label="技术点">

            </el-table-column>
        </el-table>
    </div>
</template>

<script>
    import Vue from 'vue'
    export default {
        name: "BlogMain",
        data() {
            return {
                blogMains: [
                    /*{kid: "sdf", title: "springboot1", keyPoint: "sp,xp"},
                    {kid: "wer", title: "springboot2", keyPoint: "sp1,xp"},
                    {kid: "dcx", title: "springboot3", keyPoint: "dp,xj"},
                    {kid: "13", title: "springboot4", keyPoint: "aa,dd"},
                    {kid: "xcv", title: "springboot5", keyPoint: "al,op"},*/
                ]
            }
        },
        methods:{
            getMainList(){
                Vue.axios.get("http://localhost:8500/blogMain/getFakeBlogsByType",{
                    params:{}
                }).then(res=>{
                    this.blogMains=res.data
                }).catch(err=>{
                    console.log(err)
                })
            }
        },
        mounted() {
            this.getMainList();
        }
    }
</script>

<style scoped>

</style>